import '@/styles/global.scss';
import '@/lib/config';
import '@/lib/highlight';
import type { ReactNode } from 'react';
import Wrapper from '@/app/[locale]/wrapper';
import { jetBrainsMonoFont, ralewayFont } from '@/lib/font';
import { getMetadata } from '@/lib/tool';
import classNames from 'classnames';
import { NextIntlClientProvider } from 'next-intl';
import { getMessages } from '@/lib/dictionaries';

const raleway = ralewayFont;
const jetBrainsMono = jetBrainsMonoFont;

export const metadata = getMetadata();

export default async function RootLayout({
  children,
  params: { locale },
}: {
  children: ReactNode;
  params: { locale: string };
}) {
  const { locale: _locale, messages } = await getMessages(locale);

  return (
    <html lang={_locale} data-bs-theme="auto">
      <body
        className={classNames(
          raleway.className,
          jetBrainsMono.variable,
          'yw-bg',
          'row',
          'mx-0',
        )}
      >
        <NextIntlClientProvider locale={_locale} messages={messages}>
          <Wrapper>{children}</Wrapper>
        </NextIntlClientProvider>
      </body>
    </html>
  );
}

export const dynamic = 'force-dynamic';
